import router from './router/index'
import store from './store'

router.beforeEach(async(to, from, next) => {
  // 判断是否有token
  if (localStorage.getItem('token')) {
    //   有token

    // 再次判断如果有tokrn还去登入页面的话，那就给他跳转首页
    if (to.path === '/login') {
      // 跳首页
      next('/')
    } else {
      // 则全部通过
      // 在全部通过这里判断,如果store.state.空间命名锁.userinfo.没有username的话,
      if (!store.state.user.userinfo.username) {
        // 那我们就使用 store.dispatch()调用异步的方法,调用一次请求接口,空间命名锁/异步函数名getuserinfo
        await store.dispatch('user/getuserinfo')

        // 定义一个变量，拿到我们设置好的角色
        const menus = store.state.user.userinfo.roles.menus
        // 调用vuex异步
        // 有命名空间锁/然后加上异步的函数名,然后第二个值就是，我们要传递过去的值
        const res = await store.dispatch('permission/filterRoutes', menus)
        console.log('vuex筛选后然后的结果值', res)

        // 路由系统,有一个函数叫router.addRoutes() 可以追加路由配置
        // 使得你可以通过输入 url 访问具体页面
        // { path: '*', redirect: '/404', hidden: true }

        // 因为这里是我们追加的路由,导航首位不会来到这里,因为他要先确定我们设置的路由,才会来到这里,然而我们刷新之后,他没有找到这些路由,就会报404页面,
        // 我们把404页面也发到追加这里,当我们改变url路径,刷新之后,导航首位找不到路由,想报错,也找不到404,就只能给我们空页面了
        router.addRoutes([...res, { path: '*', redirect: '/404', hidden: true }])

        console.log(to)
        // 解决,空页面
        // 我们只需要让他在执行一遍  next(to.path) 就好了,因为 to里面这时候已经储存好了我们要去的路由了,
        next(to.path)
        return
      }
      next()
    }
  } else {
    //   则没有token  让他去登入页面

    // 定义一个变量，保存没有tokrn也能去的页面，以免造成死循环
    const setlis = ['/login', '/404']

    // 判断定义的变量，使用indexOf查看，用户要去的页面，to.path找的到就让他通过，找不到就强制让他去登入页面
    if (setlis.indexOf(to.path) !== -1) {
      next()
    } else {
      next('/login')
    }
  }
})
